<script setup lang='ts'>
// 自定义 规则
//interface Props {
//}

import { onMounted, ref, defineEmits, defineProps } from "vue";
const props = defineProps({
  picColor: {
    type: String,
    default: () => "#00BD78",
  },
  item: {
    type: Object,
    default: () => ({}),
  },
  typeText: {
    type: String,
    default: () => "",
  },
  className: {
    type: String,
    default: () => "",
  }
});

const emits = defineEmits(['click']);
/**
 * @property 变量
 */

/**
 * @property  所有请求以api开头 如:apiDataInfo
 */

/**
 * @property 自定义事件 以事件名开头 如: clickButton,inputDev
 */

/**
 * @property 内置方法
 */
</script>
<template>
  <div class="w-[100%] p-3.5 b-rd-2 bg-[#F9F9F9]" @click="emits('click')" :class="className">
    <div class="flex frb">
      <text class="c-[#777777] font-size-24">订单编号：620724195003064964</text>
      <div class="font-size-24">
        <slot name="titleRight" />
      </div>
    </div>
    <div class="mt-3.5 frb font-size-28">
      <text>{{ props.typeText }}</text>
      <text :style="{ color: props.picColor }">￥{{ item.pic }}</text>
    </div>
    <slot name="bot" />
  </div>
</template>
<style lang="scss" scoped></style>